<template>
	<view class="content">
		<view class="fault-form">
		
			<view class="fault-title">
				<view class="title">请描述您的问题</view>
				<textarea v-model="form.miaoshu" placeholder="请填写问题描述以便我们提供更好的帮助..." />
			</view>
			<view class="fault-title">
				<view class="title">请上传图片凭证</view>
				<u-upload  ref="uUpload":action="action" @on-success="success"  @on-remove="remove" ></u-upload>
			</view>
		</view>
		<view class="fault-botton">
			<button @click="tijiao" class="u-reset-button">提交</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				action:'https://www.sdxiecheng.cn/index.php/index/ajax/upload',
				form:{
					type:'',
					miaoshu:'',
					image:[]
				}
			}
		},
		methods: {
			tijiao(){
					uni.$u.http.post('/proposal/index',{
						question:this.form.miaoshu,
						images:this.form.image.join(',')
					}).then(res =>{
						console.log(res)
						uni.showToast({
							icon:'success',
							title:res.msg
						})
						this.form.type = ''
						this.form.miaoshu = ''
						this.form.image = []
						this.$refs.uUpload.clear()
					})
				},
				success(e){
					console.log(e)
					this.form.image.push(e.data.fullurl)
				},
				remove(index, lists, name){
					this.form.image.splice(index,1)
					console.log(index, lists, name)
				}
		}
	}
</script>

<style lang="less">
.content{
	margin: 10rpx 20rpx;
	background: #FFFFFF;
	border-radius: 10rpx;
	min-height: 100vh;
}
.fault-form{
	padding: 30rpx 20rpx;
	box-sizing: border-box;
	.fault-title{
		margin-bottom: 40rpx;
	}
	.title{
		font-size: 28rpx;
		color: #333333;
		margin-bottom: 29rpx;
		font-weight: bold;
	}
	input{
		width: 100%;
		height: 60rpx;
		font-size: 26rpx;
		border: 1px solid #F2F2F2;
		border-radius: 10rpx;
		padding: 0 22rpx;
		box-sizing: border-box;
	}
	textarea{
		width: 100%;
		height: 200rpx;
		font-size: 26rpx;
		border: 1px solid #F2F2F2;
		border-radius: 10rpx;
		padding: 22rpx;
		box-sizing: border-box;
	}
}
.fault-botton{
	width: 100%;
	display: flex;
	justify-content: center;
	margin-top: 100rpx;
	button{
		margin: 0 auto;
		width: 650rpx;
		height: 80rpx;
		background: #FBAA27;
		border-radius: 40rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		color: #FFFFFF;
		font-size: 30rpx;
	}
}
</style>
